<template>
	<view>
		<view class="top cflex">
			<view class="selcctAllBox">
				<view class="selcctAll" v-if="selectAll==false" @tap="selectAllf"></view>
				<image src="/static/dxy-image/xuanzhong_2@2x.png" v-if="selectAll==true" mode="" @tap="selectAllf"></image>
			</view>
			<view class="all_text">
				全选
			</view>
			<view class="edit" @tap="edit">
				编辑
			</view>
		</view>

		<!-- 足迹 -->
		<block v-if="type==1" v-for="(item,index) in list">
			<view class="item cflex">
				<view class="selcctBox" v-if="editFlag==true">
					<view class="selcct" v-if="select==false" @tap="selectf"></view>
					<image src="/static/dxy-image/xuanzhong_2@2x.png" v-if="select==true" mode="" @tap="selectf"></image>
				</view>
				<image src="" mode="" class="item_img"></image>
				<view class="item_right flex">
					<view class="name">
						{{item.name}}
					</view>
					<view class="label">
						{{item.type_name}}
					</view>
					<view class="price">
						￥{{item.spec.factory_price}}
					</view>
					<view class="count">
						起订量：{{item.spec.num}}件
					</view>
				</view>
			</view>
		</block>


		<!-- 收藏 -->
		<block v-if="type==2">
			<view class="item cflex">
				<view class="selcctBox" v-if="editFlag==true">
					<view class="selcct" v-if="select==false" @tap="selectf"></view>
					<image src="/static/dxy-image/xuanzhong_2@2x.png" v-if="select==true" mode="" @tap="selectf"></image>
				</view>
				<image src="" mode="" class="item_img"></image>
				<view class="item_right flex">
					<view class="name">
						不锈钢操作台冰箱
					</view>
					<view class="label">
						冷冻 冷藏 冷藏冷冻
					</view>
					<view class="price">
						￥1200
					</view>
					<view class="count">
						起订量：30000件
					</view>
				</view>
			</view>
		</block>

		<view class="bottom1" v-if="editFlag==true">
			<view class="del">
				删除
			</view>
		</view>

	</view>
</template>

<script>
	import {
		ajax
	} from '../../ajax.js';
	export default {
		data() {
			return {
				//1:足迹；2:收藏
				type: 1,
				selectAll: false,
				select: false,
				editFlag: false,
				list: [],
				firstNum: 1
			}
		},
		onLoad(e) {
			let that = this
			that.type = e.type
			console.log(e.type)
			let token = uni.getStorageSync('token')
			if (that.type == 1) {
				that.getstep()
			} else {
				that.getcollection()
			}
		},
		methods: {
			edit() {
				let that = this
				that.editFlag = !that.editFlag
			},
			selectf() {
				let that = this
			},
			selectAllf() {
				let that = this
				let flag = that.selectAll
				console.log('flag', flag)
				that.selectAll = !flag
			},
			getstep() {
				let that = this
				let token = that.token
				let firstNum = that.firstNum
				ajax({
					url: 'visit',
					data: {
						token: token,
						firstNum: firstNum,
						num: 10
					},
					header: {
						'content-type': 'application/json' //自定义请求头信息
					},
					method: 'POST',
					success: function(res) {
						console.log("token", res.data.data.data)
						that.list = res.data.data.data

					},
					error: function() {

					}
				});
			},
			getcollection() {
				let that = this
				let token = that.token
				let firstNum = that.firstNum
				ajax({
					url: 'collect',
					data: {
						token: token,
						firstNum: firstNum,
						num: 10
					},
					header: {
						'content-type': 'application/json' //自定义请求头信息
					},
					method: 'POST',
					success: function(res) {
						console.log("token", res.data.data.data)
						that.list = res.data.data.data
					},
					error: function() {

					}
				});
			}
		}
	}
</script>

<style>
	page {
		background-color: #F7F7F7;
	}

	.top {
		background-color: #FFFFFF;
		padding-bottom: 23rpx;
	}

	.selcctAllBox {
		margin-top: 15rpx;
		margin-left: 26rpx;
		margin-right: 30rpx;
	}

	.selcctAllBox>image {
		width: 26rpx;
		height: 26rpx;
		box-sizing: border-box;
		margin-bottom: 12rpx;
	}

	.selcctAll {
		width: 26rpx;
		height: 26rpx;
		border: #FF7427 1px solid;
		box-sizing: border-box;
		border-radius: 100rpx;
	}

	.all_text {
		font-size: 28rpx;
		color: #333333;
		margin-top: 10rpx;
	}

	.edit {
		margin-left: 493rpx;
		font-size: 26rpx;
		color: #999999;
		border: 1px solid #999999;
		width: 100rpx;
		height: 37rpx;
		margin-top: 10rpx;
		text-align: center;
		line-height: 37rpx;
		border-radius: 10rpx;
	}

	.item {
		width: 712rpx;
		height: 210rpx;
		background-color: #FFFFFF;
		border-radius: 10rpx;
		margin: 23rpx auto;
	}

	.selcct {
		width: 26rpx;
		height: 26rpx;
		border: #999999 1px solid;
		box-sizing: border-box;
		border-radius: 100rpx;
	}

	.selcctBox {
		width: 26rpx;
		height: 26rpx;
		padding-top: 78rpx;
		margin-left: 8rpx;
	}

	.item_img {
		background-color: #007AFF;
		width: 149rpx;
		height: 149rpx;
		border-radius: 10rpx;
		margin: 24rpx 0 0 23rpx;
	}

	.item_right {
		margin-left: 21rpx;
		margin-top: 22rpx;
	}

	.name {
		font-size: 28rpx;
		color: #333333;
	}

	.label {
		font-size: 24rpx;
		color: #555555;
		margin: 7rpx 0 10rpx 0;
	}

	.price {
		font-size: 24rpx;
		color: #D50000;
	}

	.count {
		font-size: 28rpx;
		color: #333333;
		margin-top: 10rpx;
	}

	.bottom1 {
		position: fixed;
		bottom: 0;
		height: 100rpx;
		background-color: #FFFFFF;
		width: 750rpx;
	}

	.del {
		width: 120rpx;
		height: 62rpx;
		background-color: #FF7427;
		color: #FFFFFF;
		text-align: center;
		font-size: 28rpx;
		line-height: 62rpx;
		border-radius: 10rpx;
		position: absolute;
		right: 46rpx;
		top: 16rpx;
	}
</style>
